<template>
  <view class="content">
    <up-icon
      class="back-icon"
      name="arrow-left"
      size="30rpx"
      @tap="handleBackIconClick"
    />
    <top @on-click="changeChecklist" @on-search="goDetailPage" />

    <text
      class="header-title min"
      style="
        margin: 0 20rpx 0 40rpx;
        margin-top: 250rpx;
        margin-bottom: 30rpx;
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 140%;
      "
    >
      {{ typeName }}热搜榜
      <!-- <button class="heightlevel" @click="search">高级搜索</button> -->
    </text>
    <billboard
      v-if="!checkTypeName.includes(typeName.value) && billboardData.length > 0"
      :list-data="billboardData"
      :type-name="typeName"
      @on-click="onBillboard"
    />
    <none-data
      v-if="
        checkTypeName.includes(typeName.value) ||
        (billboardData.length === 0 && isLoading)
      "
    />
    <!-- 登录弹窗 -->
    <loginDialog
      @on-off="userLoginDialog = false"
      @on-make="headelMake"
      :indicate="userLoginDialog"
    >
    </loginDialog>
  </view>
</template>

<script setup>
import loginDialog from "@/components/login/index.vue";
import top from "./components/top.vue";
import billboard from "@/components/billboard/index.vue";
import { ref, getCurrentInstance, inject } from "vue";
import { getHomePageHot } from "@/api/honour/index.js";
import { onReachBottom, onLoad } from "@dcloudio/uni-app";
import { customNav } from "@/utils/customNav";
const userLoginDialog = ref(false);
const userLoginInfo = ref("");
const typeName = ref("企业");
const billboardData = ref([]);
const total = ref(null);
const pageNum = ref(1);
const pageSize = ref(5);
const isLoading = ref(false);
const { proxy } = getCurrentInstance();

const currentSearchType = ref("");
const checkTypeName = ["个人", "集体"];

function changeChecklist(data) {
  currentSearchType.value = data.detail.value;
  let name = data.detail.value;
  switch (name) {
    case "企业荣誉":
      typeName.value = "企业";
      break;
    case "个人荣誉":
      typeName.value = "个人";
      break;
    case "集体荣誉":
      typeName.value = "集体";
      break;
    default:
      break;
  }
  getData();
}

const packageHonourPath = inject("packageHonourPath");
const goDetailPage = (data) => {
  /*if (!userLoginInfo.value) {
    userLoginDialog.value = true;
  } else {*/
    console.log(currentSearchType.value);
    switch (currentSearchType.value) {
      case "企业荣誉":
        customNav(
          `${packageHonourPath}/search-detail?searchName=${data}&searchType=${currentSearchType.value}`
        );
        break;
      case "个人荣誉":
        customNav(
          `${packageHonourPath}/search-personal?searchName=${data}&searchType=${currentSearchType.value}`
        );
        break;
    }
  // }
};

function onBillboard(data) {
  console.log(data);
  /*if (!userLoginInfo.value) {
    userLoginDialog.value = true;
  } else {*/
    switch (typeName.value) {
      case "企业":
        customNav(
          `enterprise-honor-detail?name=${data.name}&&typeName=${typeName.value}&&id=${data.id}`
        );
        break;
      case "集体":
        // uni.navigateTo({
        //   url: `/package_honour/pages/honour/details?name=${data.name}&&typeName=${typeName.value}&&id=${data.id}`,
        // });
        break;
      case "个人":
        // customNav("personal-list");
        uni.navigateTo({
          url: `/package_honour/pages/honour/enterprise-honor-personal?id=${data.id}`,
        });
        break;

      default:
        break;
    }
  // }
}
const handleBackIconClick = () => {
  uni.switchTab({
    url: "/pages/index/index",
  });
};

/**
 * 登录弹窗关闭事件
 */
const headelMake = () => {
  userLoginDialog.value = false;
  userLoginInfo.value = uni.getStorageSync("token");
};
onLoad(() => {
  userLoginInfo.value = uni.getStorageSync("token");
  getData();
});

function getData() {
  billboardData.value = [];
  let hotObj = {
    企业: 0,
    个人: 2,
    集体: 3,
  };
  isLoading.value = false;
  getHomePageHot(hotObj[typeName.value]).then((res) => {
    total.value = res.data?.length;
    isLoading.value = true;
    res.data &&
      res.data.map((o) => {
        switch (typeName.value) {
          case "企业":
            billboardData.value.push({
              id: o.id,
              time: o.createTime,
              name: o.realName || o.hotName,
              deputy: o.legalRepresentative,
              counties: o.counties,
            });
            break;
          case "个人":
            billboardData.value.push({
              id: o.id,
              time: o.createTime,
              name: o.realName || o.hotName,
              deputy: o.enterpriseName,
              counties: o.enterpriseName,
            });
            break;

          default:
            break;
        }
      });
  });
}

onReachBottom(() => {
  if (pageNum.value * pageSize.value >= total.value) {
    uni.showToast({
      title: "没有更多数据了",
      icon: "none",
      duration: 1000,
    });
    setTimeout(() => {
      uni.hideLoading();
    }, 500);
  } else {
    if (pageNum.value <= pageNum.value - 1) {
      setTimeout(() => {
        uni.hideLoading();
      }, 500);
    } else {
      uni.showLoading({
        title: "加载中",
      });
      pageNum.value++;
      getData();
    }
    setTimeout(() => {
      uni.hideLoading();
    }, 500);
  }
});
</script>

<style lang="less" scoped>
@import "@/static/style/global.less";
@import "./style/index.less";
</style>
